﻿Ext.define("Ext.ux.comboboxtree", {
    extend: "Ext.form.field.Picker",
    requires: ["Ext.tree.Panel"],
    initComponent: function () {
        var me = this;
        me.callParent();
    },
    createPicker: function () {
        var me = this;
        var store = Ext.create('Ext.data.TreeStore', {
            proxy: {
                type: 'ajax',
                url: me.storeUrl
            },
            sorters: [
                { property: 'leaf', direction: 'ASC' },
                { property: 'text', direction: 'ASC' }
            ],
            root: {
                id: me.rootId,
                text: me.rootText
            },
            nodeParameter: me.treeNodeParameter
        });
        me.picker = new Ext.tree.Panel({
            height: 300,
            autoScroll: true,
            floating: true,
            focusOnToFront: false,
            shadow: true,
            ownerCt: this.ownerCt,
            useArrows: true,
            store: store,
            rootVisible: false,
            listeners: {
                'itemclick': function (view, re) {
                    me.setRawValue(re.data.id); // 隐藏值
                    me.setValue(re.data.text); // 显示值
                    me.collapse();
                }
            }
        });
        me.picker.on({
            checkchange: function () {
                var records = me.picker.getView().getChecked(), names = [], values = [];
                Ext.Array.each(records, function (rec) {
                    names.push(rec.get('text'));
                    values.push(rec.get('id'));
                });
                me.setRawValue(values.join(';')); // 隐藏值
                me.setValue(names.join(';')); // 显示值
            }
        });
        return me.picker;
    },
    alignPicker: function () {
        var me = this, picker, isAbove, aboveSfx = '-above';
        if (this.isExpanded) {
            picker = me.getPicker();
            if (me.matchFieldWidth) {
                picker.setWidth(me.bodyEl.getWidth());
            }
            if (picker.isFloating()) {
                picker.alignTo(me.inputEl, "", me.pickerOffset); // ""->tl
                isAbove = picker.el.getY() < me.inputEl.getY();
                me.bodyEl[isAbove ? 'addCls' : 'removeCls'](me.openCls
      + aboveSfx);
                picker.el[isAbove ? 'addCls' : 'removeCls'](picker.baseCls
      + aboveSfx);
            }
        }
    }
});
Ext.onReady(function () {
//    var data = { "EntityID": 1, "name": '1' };
//    var com = Ext.create("Ext.ux.comboboxtree", {
//        id: 'name',
//        name: 'name',
//        hiddenName: 'hiddenName',
//        storeUrl: 'facade.axd?s_action=RoomClass',
//        width: 270,
//        fieldLabel: '行政区划',
//        labelWidth: 60,
//        rootId: '44000000000000',
//        rootText: '广东省',
//        treeNodeParameter: 'code'
//        //renderTo: 'tree-div'
//    });
//    var form = Ext.create('Ext.form.Panel', {
//        waitMsgTarget: true,
//        autoScroll: true,
//        bodyPadding: 5,
//        frame: true,
//        width: 400,
//        height: 300,
//        border: false,
//        items: [com, { fieldLabel: 'First Name',
//            name: 'EntityID',
//            allowBlank: false, xtype: 'textfield'
//        }],
//        renderTo: 'tree-div'
//    });

});

Ext.onReady(function () {
    Array.prototype.sortObjectWith = function (key, t, fix) {
        if (!this.length) { return this; }    // 空数组
        t = t === 'des' ? 'des' : 'asc'; // ascending or descending sorting, 默认 升序
        fix = Object.prototype.toString.apply(fix) === '[object Function]' ? fix : function (key) { return key; };
        switch (Object.prototype.toString.apply(fix.call({}, this[0][key]))) {
            case '[object Number]':
                return this.sort(function (a, b) { return t === 'asc' ? (fix.call({}, a[key]) - fix.call({}, b[key])) : (fix.call({}, b[key]) - fix.call({}, a[key])); });
            case '[object String]':
                return this.sort(function (a, b) { return t === 'asc' ? fix.call({}, a[key]).localeCompare(fix.call({}, b[key])) : fix.call({}, b[key]).localeCompare(fix.call({}, a[key])); });
            default: return this;  // 关键字不是数字也不是字符串, 无法排序
        }
    }
    var items = [
        { name: "RoomNO", label: "房号", sort: 1, ex_list: { width: 60 }, ex_edit: { allowBlank: false, width: 250} },
        { name: "ClassName", label: "房型", sort: 3, ex_list: { width: 80 }, ex_edit: { xtype: 'treecombo', ex_combo: { ds: 'RoomTree', field: 'Cid' }, cfg: { allowBlank: false, labelWidth: 70, width: 200}} },
        { name: "Floor", label: "楼层", sort: 5, ex_edit: { allowBlank: false, width: 250} },
        { name: "Deposit", label: "押金", sort: 12, ex_edit: { allowBlank: true, width: 250} },
        { name: "IsComputer", label: "电脑", sort: 9, ex_list: { width: 60, renderer: Kwan.colorHas }, ex_edit: { xtype: 'checkgroup', group: 1} },
        { name: "IsMaQue", label: "麻雀", sort: 9, ex_list: { width: 60, renderer: Kwan.colorHas }, ex_edit: { xtype: 'checkgroup', group: 1} },
        { name: "Status", label: "状态", sort: 7, ex_list: { width: 60, renderer: Kwan.colorRoomStatus }, ex_edit: { xtype: 'SimpleCombo', ex_combo: { ds: Kwan.f_status }, cfg: { allowBlank: false, labelWidth: 70, width: 200}} },
        { name: "Price", label: "单价", sort: 2, ex_list: { width: 60 }, ex_edit: { allowBlank: true, width: 250} },
        { name: "HalfPrice", label: "半天价", sort: 4, ex_list: { width: 60 }, ex_edit: { allowBlank: true, width: 250} },
        { name: "HourPrice", label: "钟点价", sort: 6, ex_list: { width: 60 }, ex_edit: { allowBlank: true, width: 250} },
        { name: "NightPrice", label: "夜房价", sort: 8, ex_list: { width: 60 }, ex_edit: { allowBlank: true, width: 250} },
        { name: "Reserve", label: "最低价", sort: 10, ex_edit: { allowBlank: true, width: 250} },
        { name: "CreatedDate", label: "创建日期",sort:11, ex_list: { width: 120, xtype: 'datecolumn', format: 'Y-m-d H:i:s' }, ex_edit: { xtype: 'datefield', allowBlank: true, width: 250} }
	    ];

    /*测试代码*/
    var time1 = new Date
    // 比较各游览器的DOM运行速度。
    items = items.sortObjectWith('sort', 'asc', function (id) { return parseInt(id); });
    alert("耗时：" + (new Date - time1) + " 毫秒");

    

    items = items.sortObjectWith('sort', 'asc', function (id) { return parseInt(id); });
    for (var i = 0, l = items.length; i < l; i++) {
        document.write('<pre>&#09;' + items[i].name + '&#09;' + items[i].label + '&#09;' + items[i].sort + '</pre>');
    }

    var panel = Ext.create('Ext.form.Panel', {
        id: 'main-panel',
        baseCls: 'x-plain',
        renderTo: Ext.getBody(),
        layout: {
            type: 'table',
            columns: 2
        },
        // applied to child components
        defaults: { width: 200 },
        items: [{
            xtype: 'textfield', name: 'Item 1'
        }, {
            xtype: 'textfield', name: 'Item 2'
        }, {
            xtype: 'textfield', name: 'Item 3'
        }, {
            xtype: 'textfield', name: 'Item 4',
            width: 410,
            colspan: 2
        }, {
            xtype: 'textfield', name: 'Item 5'
        }, { border: 0 }, {
            xtype: 'textfield', name: 'Item 6'
        }, {
            xtype: 'textfield', name: 'Item asd'
        }]
    });
});